

// 1，动态渲染搜索历史数据，通过本地存储创建假数据来进行渲染
// 2，搜索按钮注册事件-校验-弹框-确定按钮点击后-ajax+渲染页面-跳转到搜索列表画面？
// 3，点击小叉的删除按钮，弹出确认框，确定删除按钮点击-重新渲染页面
// 4，控制页面的历史记录条数，全部都删除的情况下，隐藏整个搜索历史框，只给一个没有搜索记录的提示
// 5，点击左箭头后，回到迁移原画面

$(function(){

// 从本地获取搜索到的数据并渲染到画面并封装成函数--先用假数据
// var arr = ['春','夏','秋','冬','风','花','雪','月']
// localStorage.setItem('forSearch',JSON.stringify(arr))
function render(){
    var htmlStr = JSON.parse(localStorage.getItem('forSearch'))
var obj ={
    htmlStr:htmlStr
}
$('.search-history').html(template('temp',obj))
}
render()


  // 2- 清空历史记录  


$('.clear').on('click',function(){
    mui.confirm('确定要执行此操作吗？','温馨提示',['再想想','狠心删除'],function(e){
        console.log(e);
        if(e.index==1){
            localStorage.removeItem('forSearch')
            render()
        }
        
    })
})


 // 3 - 删除一条历史记录

    $('.btn-del').on('click',function(){
        mui.confirm('确定要执行此操作吗？','温馨提示',['再想想','狠心删除'],function(e){
        if(e.index==1){
            var index = $(this).data('id')
            var content = JSON.parse(localStorage.getItem('forSearch'))
            content.splice(index,1)
            localStorage.setItem('forSearch',JSON.stringify(content))
            render()
        }
    })
    
})

// 4- 添加历史记录 


  $('.s1-btn').on('click',function(){
    var str = $('.s1-txt').val()
      if(str.trim().length == 0){
        mui.toast('请输入搜索关键字')
        return
      }
      
      var his = JSON.parse(localStorage.getItem('forSearch')) || []
      var index = his.indexOf(str)
      if(index > -1){
        // 先删后加
        
        his.splice(index,1)
      }
      his.unshift(str)
      if(his.length > 6){
          his.pop()
      }
      localStorage.setItem('forSearch',JSON.stringify(his))
      render()
      $('.s1-txt').val('')
      

    //   跳转到搜索列表页面（涉及到画面间传值的问题）
    location.href = './searchList.html?key='+str
  })


})

